<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"></meta>
    <title>videocontent</title>
</head>
<body>
<videocontent th:fragment="videocontent">
    <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <div class="container-fluid">
                <div class="row mb-2">
                    <div class="col-sm-6">
                        <h1>我的文件/视频</h1>
                    </div>
                    <div class="col-sm-6">
                        <ol class="breadcrumb float-sm-right">
                            <li class="breadcrumb-item"><a href="index">Home</a></li>
                            <li class="breadcrumb-item active">我的文件/视频</li>
                            <div class="tipmsg" th:if="${session.tipmsg} != null">
                                <span th:text="${session.tipmsg}" style="margin-right: 25px"></span><i
                                    class="fas fa-times" onclick="closeTip()"></i>
                            </div>
                            <div class="tipmsg1" style="display: none">
                            </div>
                        </ol>
                    </div>
                </div>
            </div><!-- /.container-fluid -->
        </section>

        <!-- Main content -->
        <section class="content">
            <div class="container-fluid">
                <span id="fileid" style="display: none"></span>
                <span id="filename" style="display: none"></span>

                <!--  /.videoPlayer-->
                <div class="row videoplayer" style="display: none;width:100%;height:100%">
                    <span class="videoName" style="margin: 0 auto"></span>
                    <div style="width:100%;height:100%">
                        <div id="video"></div>
                    </div>
                    <button class="fas fa-desktop" style="margin: 0 auto;padding-top: 5px;border: none"
                            onclick="backToFileView()">返回
                    </button>
                </div>


                <div class="row filebox" th:if="${files.size() > 0}">
                    <div class="col-lg-3 col-md-6 col-sm-6 files" th:each="f:${files}">
                        <span style="display: none" id="tempid" th:text="${f.myFileId}"></span>
                        <span style="display: none" id="tempname" th:text="${f.myFileName}"></span>
                        <span style="display: none" id="temppostfix" th:text="${f.postfix}"></span>
                        <div class="card">
                            <a class="card-image" style="background-image: url(img/video_logo.png);">
                                <img src="img/video_logo.png"/>
                            </a>
                            <div class="card-description">
                                <h6 class="editname" th:text="${f.myFileName+f.postfix}"></h6>
                                <h6 th:if="${f.size > 1024}" th:text="${f.size/1024 +'MB'}"></h6>
                                <h6 th:if="${f.size < 1024}" th:text="${f.size +'KB'}"></h6>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row" th:if="${files.size() == 0}">
                    <div class="col-12 col-sm-12 col-lg-12">
                        <div class="alert alert-primary alert-has-icon alert-dismissible show fade">
                            <div class="alert-icon"><i class="ion ion-ios-lightbulb-outline"></i></div>
                            <div class="alert-body">
                                <button class="close" data-dismiss="alert">
                                    <span>×</span>
                                </button>
                                <div class="alert-title">这里空空的，什么都没有..</div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- /.row -->
            </div><!-- /.container-fluid -->
            <div class="row">
                <div class="col-12">
                    <div class="zxf_pagediv"></div>
                </div>
            </div>
            <div id="pageNum" style="display: none">[[${page.getPages()}]]</div>
            <div id="current" style="display: none">[[${page.getPageNum()}]]</div>
        </section>
        <!-- /.content -->
    </div>
</videocontent>
</body>
</html>